<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('督办处理')" />
    <th:block th:include="include :: jq-viewer-css" />
</head>
<body>
<div class="wrapper wrapper-content animated fadeIn">
<div class="row">
    <div class="col-sm-12">
        <div class="tabs-container">
            <ul class="nav nav-tabs">
                <li class="active"><a data-toggle="tab" href="#tab-error" aria-expanded="true">督办信息</a></li>
                <li class=""><a data-toggle="tab"   href="#tab-image" aria-expanded="false">影像信息</a></li>
                <li class=""><a data-toggle="tab"   href="#tab-trade" aria-expanded="false">流水信息</a></li>
                <li class=""><a data-toggle="tab"   href="#tab-rel" aria-expanded="false">关联信息</a></li>
                <li class=""><a data-toggle="tab"   href="#tab-wf" aria-expanded="false">流程信息</a> </li>
                <li class=""><a data-toggle="tab"   href="#tab-his" aria-expanded="false">历史督办</a></li>
            </ul>
            <div class="tab-content">
                <!-- 督办信息 -->
                <div id="tab-error" class="tab-pane active">
                    <div class="panel-body">
                        <form class="form-horizontal m" id="doErrorProcess-form">
                            <input name="id" id="id" type="hidden">
                            <input name="tradeId" id="tradeId" type="hidden">
                            <input name="auTypeId" id="auTypeId" type="hidden">
                            <input name="auditItemId" id="auditItemId" type="hidden">
                            <input name="errSource" id="errSource" type="hidden">
                            <input name="nextWorkItemId" id="nextWorkItemId" type="hidden">
                            <input name="curWorkitemId" id="curWorkitemId" type="hidden">

                            <div class="row">
                                <div class="form-group col-sm-6">
                                    <label class="col-sm-4 control-label">交易日期：</label>
                                    <div class="col-sm-8">
                                        <div class="input-group">
                                            <span id="trDate" name="trDate" class="form-control" ></span>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group col-sm-6">
                                    <label class="col-sm-4 control-label">整改期限：</label>
                                    <div class="col-sm-8">
                                        <div class="input-group date">
                                            <span id="correctLimitDate" name="correctLimitDate" class="form-control" ></span>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group col-sm-6">
                                    <label class="col-sm-4 control-label">机构号：</label>
                                    <div class="col-sm-8" >
                                        <span id="orgId"  name="orgId" class="form-control" ></span>
                                    </div>
                                </div>
                                <div class="form-group col-sm-6" style="display: none">
                                    <label class="col-sm-4 control-label">机构名称：</label>
                                    <div class="col-sm-8">
                                        <span id="orgName" name="orgName" class="form-control" ></span>
                                    </div>
                                </div>
                                <div class="form-group col-sm-6">
                                    <label class="col-sm-4 control-label">柜员号：</label>
                                    <div class="col-sm-8">
                                        <span id="tellerId"   name="tellerId" class="form-control" ></span>
                                    </div>
                                </div>
                                <div class="form-group col-sm-6" style="display: none">
                                    <label class="col-sm-4 control-label">柜员姓名：</label>
                                    <div class="col-sm-8">
                                        <span id="tellerName" name="tellerName" class="form-control" ></span>
                                    </div>
                                </div>
                                <div class="form-group col-sm-6" >
                                    <label class="col-sm-4 control-label">流水号：</label>
                                    <div class="col-sm-8">
                                        <span id="vchNo"  name="vchNo" class="form-control" ></span>
                                    </div>
                                </div>

                                <div class="form-group col-sm-12">
                                    <label class="col-sm-2  control-label">风险描述：</label>
                                    <div class="col-sm-10 center-block">
                                        <div class="form-control" name="auditProceeding" id="auditProceeding"  style="height:150px;overflow-y:auto;"></div>
                                    </div>
                                </div>
                                <div class="form-group col-sm-12">
                                    <label class="col-sm-2 control-label">整改建议：</label>
                                    <div class="col-sm-10 ">
                                    <div class="form-control" name="auditSuggest" id="auditSuggest"  style="height:100px;overflow-y:auto;"></div>
                                    </div>
                                </div>
                                <div class="form-group col-sm-12" >
                                    <label class="col-sm-2 control-label">风险点：</label>
                                    <div class="col-sm-10">
                                        <div id="paeaErPoint" name="paeaErPoint"  class="form-control" th:required="required"  style="height:100px;overflow-y:auto;"></div>
                                    </div>
                                </div>
                                <div class="form-group col-sm-12">
                                    <label class="col-sm-2 control-label">意见：</label>
                                    <div class="col-sm-10">
                                        <textarea id="replyComments" name="replyComments" class="form-control" th:required="required" type="text" placeholder="请输入您的意见" rows="3"></textarea>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
                <!-- 影像信息 -->
                <div id="tab-image" class="tab-pane">
                    <div class="box-body">
                        <div class="imageBox col-sm-12" id="imageBox"  style="display: none" ></div>
                    </div>
                </div>
                <!-- 流水信息 -->
                <div id="tab-trade" class="tab-pane">
                    <div class="panel-body"  >
                        <div class="form-group col-sm-6">
                        <label class="col-sm-3 control-label">交易日期：</label>
                        <div class="col-sm-8">
                            <div id="trDate" class="form-control" ></div>
                        </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-3 control-label">交易机构：</label>
                            <div class="col-sm-8">
                                <div id="brCode" class="form-control" ></div>
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-3 control-label">柜员号：</label>
                            <div class="col-sm-8">
                                <span id="trTelr" class="form-control" ></span>
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-3 control-label">交易时间：</label>
                            <div class="col-sm-8">
                                <span id="txnTime" class="form-control" ></span>
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-3 control-label">流水号：</label>
                            <div class="col-sm-8">
                                <span id="txnSeq" class="form-control" ></span>
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-3 control-label">交易码：</label>
                            <div class="col-sm-8">
                                <span   id="txnCde" class="form-control" ></span>
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-3 control-label">交易金额：</label>
                            <div class="col-sm-8">
                                <span  id="txnAmt" class="form-control" ></span>
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-3 control-label">借贷方：</label>
                            <div class="col-sm-8">
                                <span   id="vchSign" class="form-control" ></span>
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-3 control-label">货币码：</label>
                            <div class="col-sm-8">
                                <span id="ccyCode"  class="form-control"  ></span>
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-3 control-label">账号：</label>
                            <div class="col-sm-8">
                                <span  id="accNo" class="form-control" ></span>
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-3 control-label">客户号：</label>
                            <div class="col-sm-8">
                                <span   id="custIdt" class="form-control" ></span>
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-3 control-label">客户名称：</label>
                            <div class="col-sm-8">
                                <span id="custName"   class="form-control" ></span>
                            </div>
                        </div>

                     </div>
                </div>
                <!-- 关联信息 -->
                <div id="tab-rel" class="tab-pane">
                    <div class="panel-body">
                        <div class="imageBox col-sm-12" id="relTable"  >
                        <strong>无</strong>
                        </div>
                    </div>
                </div>
                <!-- 流程信息 -->
                <div id="tab-wf" class="tab-pane">
                    <div class="panel-body">
                        <div class="col-sm-12 select-table table-striped">
                            <table id="workFlow-table"></table>
                        </div>
                    </div>
                </div>
                <!-- 历史督办 -->
                <div id="tab-his" class="tab-pane">
                    <div class="panel-body">
                        <div class="col-sm-12 select-table table-striped">
                        <table id="hisError-table"></table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
    <!--
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox-content" style="text-align:center">
                <button class="btn btn-primary " type="button"><i class="fa fa-check"></i>&nbsp;提交</button>
                <button class="btn btn-warning " type="button"><i class="fa btn-warning"></i> <span class="bold">退回</span></button>
                <button class="btn btn-info " type="button" onclick="$.modal.cancel()"><i class="fa fa-close"></i> <span class="bold">关闭</span></button>
            </div>
        </div>
    </div>

    -->

</div>
<div class="layui-layer-btn layui-layer-btn-c">
    <a class="layui-layer-btn0">提交</a>
    <a class="layui-layer-btn1">退回</a>
    <a class="layui-layer-btn2">关闭</a>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: jq-viewer-js" />
</body>
<script th:inline="javascript">
    var prefix = ctx + 'er/paeaErProcess';
    var prefixWfWorkItem = ctx + "wf/wfWorkItem";
    var prefixEr = ctx + 'er/paeaErError';
    var prefixErPoint = ctx + 'er/paeaErPoint';

    var prefixPaeaDsTrade = ctx + "paea/paeaDsTrade";
    var errId= [[${paeaErError.id}]];
    var tradeId='';
    var vchNo='';
    var errSource='';
    var imgPathPrefix='';
    var trDate='';
    var workFlowOptions = {
       // url: prefixWfWorkItem + "/list",
        showSearch: false,
        showRefresh: false,
        showToggle: false,
        showColumns: false,
        pagination: false,
        uniqueId: "id",

        columns: [{
                field : 'seq',
                title : '序号',
                formatter: function (value, row, index) {
                    return index+1;
                }
            },
            {
                field : 'code',
                title : '节点编码'
            },
            {
                field : 'name',
                title : '节点名称'
            },
            {
                field : 'operCode',
                title : '操作人代码'
            },
            {
                field : 'operName',
                title : '操作人姓名'
            },
            {
                field : 'finishedTime',
                title : '完成时间'
            },
            {
                field : 'remarkValue',
                title : '意见'
            }]
    };
    var hisErrorOptions = {

        showSearch: false,
        showRefresh: false,
        showToggle: false,
        showColumns: false,
        pagination: false,
        uniqueId: "id",
        detailUrl:prefixEr+"/detail/{id}",

        columns: [
            {
                field : 'seq',
                title : '序号',
                formatter: function (value, row, index) {
                    return index+1;
                }
            },
            {
                field : 'errRegOper',
                title : '创建人'
            },
            {
                field : 'createTime',
                title : '创建时间'
            },
            {
                field : 'errTitle',
                title : '差错描述'
            },
            {
                field : 'errState',
                title : '状态'
            },
            {
                title: '操作',
                align: 'center',
                formatter: function(value, row, index) {
                    var actions = [];
                    actions.push('<a class="btn btn-success btn-xs " href="javascript:void(0)" onclick="$.operate.detail(\'' + row.id + '\')"><i class="fa fa-edit"></i>查看</a> ');
                    return actions.join('');
                }
            }]
    };





    function refreshError(errId){
        $.operate.get(prefixEr+"/selectPaeaErErrorById/"+errId,function(result){
            let paeaErError =result.data;
            //alert(paeaErError.trDate);
            $("#tab-error .form-control").each(function() {
               $(this).text(paeaErError[this.id]);
            });

            tradeId=paeaErError.tradeId;
            vchNo=paeaErError.vchNo;
            errSource = paeaErError.errSource;
            trDate=paeaErError.trDate;
        });
    }
    function refreshPoints(errId){
            $.operate.get(prefixErPoint+"/selectPaeaErPointsByErrId/"+errId,function(result){
            // alert(result.data);
            let paeaErPoint='';
            let paeaErPointList =result.data;
            $.each(paeaErPointList,function(i,point) {
                paeaErPoint+=point.code+"-"+point.name+'<br>'
            });
            $("#paeaErPoint").html(paeaErPoint);
        });
    }
    function refreshImage(errId){
        $.operate.get(prefixEr+"/selectSdiImageListByErrId/"+errId,function(result){
            let sdiImageList =result.data;
            $('#imageBox').html("");
            $.each(sdiImageList, function(index, sdiImage) {
            var imageUrl = "http://139.224.192.210:8099/httpfiletrans/HttpFileTrans?method=download&FilePath=" +sdiImage.sdifilepath;
            $('#imageBox').append('<img name= "img'+index+'" src="'+imageUrl+'" alt="影像">');
            });
            $('#imageBox').viewer('update');

        });
    }
    function refreshTrade(errId){
        $.operate.get(prefixEr+"/selectPaeaDsTradeByErrId/"+errId,function(result){
            let paeaDsTrade =result.data;
            //alert(paeaErError.trDate);
            $("#tab-trade .form-control").each(function() {
                //alert(this.name);
                $(this).text(paeaDsTrade[this.id]);
            });
        });
    }
    function refreshWorkFlow(errId){
        $.operate.get(prefixWfWorkItem+"/selectWfWorkItemsByErrId/"+errId,function(result){
            let WfWorkItemList =result.data;
            $("#workFlow-table").bootstrapTable('removeAll');
            $('#workFlow-table').bootstrapTable('load',WfWorkItemList);
        });

    }
    function refreshButtons(errId){
        $.operate.get(prefixWfWorkItem+"/selectWfBranchActsByErrId/"+errId,function(result){
            let WfWorkItemList =result.data;
            $("#workFlow-table").bootstrapTable('removeAll');
            $('#workFlow-table').bootstrapTable('load',WfWorkItemList);
        });

    }
    function refreshHisError(errId){
       // $.table.get("hisError-table");
        $.operate.get(prefixEr+"/selectPaeaErErrorHisListByErrId/"+errId,function(result){
            let paeaErErrorList =result.data;
            $("#hisError-table").bootstrapTable('removeAll');
            $('#hisError-table').bootstrapTable('load',paeaErErrorList);
        });
    }
    function initWorkFlow(){
        $("#workFlow-table").bootstrapTable('removeAll');
        $("#workFlow-table").bootstrapTable(workFlowOptions);
    }
    function initHisError() {
        $("#hisError-table").bootstrapTable('removeAll');
        $("#hisError-table").bootstrapTable(hisErrorOptions);
    }
    function initImage(){

        $('#imageBox').append('<img name= "img'+'demo'+'" id="imgArea" src="/img/test01.png" alt="示例图片">');
        $('#imageBox').viewer({
            inline:true,
            minWidth:$(document.body).width()-20,
            minHeight:$(document.body).height()-60,
            viewed: function () {
                $.each($('.viewer-canvas img'),function(i , img){
                    // var url = $(this).attr("src");
                    // var imageId = getParam(url, "imageId");
                });
            }
        }).viewer('update');
    }
    function refreshPage(errId){
        refreshError(errId);
        refreshPoints(errId);
        refreshTrade(errId);
        refreshImage(errId);
        refreshWorkFlow(errId);
        refreshHisError(errId);

    }
    $(function() {

        initWorkFlow();
        initHisError();
        initImage();

        refreshPage(errId);
        alert(layer.btn);
        // initImageArea(errId);

    });
    function submitHandler() {
        if ($.validate.form()) {
            alert(11);
            $.operate.save(prefix + "/submitWorkFlow", $('#doErrorProcess-form').serialize());
        }
    }
</script>
</html>